<style lang="scss" scoped rel="stylesheet/scss">
    .contrainer{
        width: 100%;
        height: 100%;
        overflow: auto;
        box-sizing: border-box;
        flex-direction: column;
        .chj_banner{
            width: 100%;
            height: 250px;
						img{
							width: 100%;
							height: 100%;
						}
        }
        .chj_info{
            width:100%;
            height:100px;
            display:flex;
            box-sizing:border-box;
            padding: 15px 0 15px 15px;
						border-bottom: 1px solid #E5E5E5;
            .chj_info__avatar{
                width:70px;
                height:70px;
                >img{
                    width:100%;
                    height:100%;
                }
            }
            .chj_info__msg{
                display:flex;
                flex:1;
								margin-left: 10px;
                align-items: flex-start;
                flex-direction:column;
								font-size: 15px;
								color: #919191;
								justify-content:space-around;
                >p{
                    font-size:17px;
                    color: #484848;
                    font-weight: 600;
                }
            }
        }
				.chj_info-bottom{
					width: 100%;
					height: 10px;
					background: #f0f0f0;
				}
				.chj_store{
					flex: 1;
					width: 100%;
					display: flex;
					flex-direction: column;
					.chj_store_nav{
						width: 100%;
						height: 44px;
						display: flex;
						align-items: center;
						border-top:1px solid #E5E5E5;
						>li{
							flex: 1;
							line-height: 44px;
							height: 100%;
						}
						>li.current{
							color: #fa4113;
							font-size: 15px;
							border-bottom: 4px solid #fa4113;
						}
					}
				}
				.chj_store_con{
					box-sizing: border-box;
					color: #919191;
					font-size: 15px;
					padding: 21px  16px 0px 16px;
					>p{
						color: #484848;
						font-size: 19px;
						font-weight: 600;
						text-align: left;
						margin-bottom: 20px;
					}
					>span{
						display: inline-block;
						margin-bottom:15px;
						text-align: left;
						width: 100%;
					}
					
				}
				.chj_download-btn{
					width: 100%;
					height: 50px;
					padding: 5px 15px;
					display: flex;
					align-items: center;
					box-sizing: border-box;
					border-top: 1px solid #DDDDDD;
					color: #fff;
					font-size: 17px;
					>span{
						display: block;
						width: 100%;
						height: 100%;
						line-height: 40px;
						border-radius: 5px;
						background: #E6512D;
					}
				}
				.chj_store_pro{
					width: 100%;
					height: auto;
					position: relative;
					padding: 21px  5px 0px 5px;
					box-sizing: border-box;
					>div{
						width: 33.3%;
						height: 100px;
						float: left;
						margin-bottom: 5px;
						>img{
							width: 95%;
							height: 80%;
							display: block;
						}
					}
				}
    }
</style>
<template>
    <div class="contrainer" v-if="list">
       <div class="chj_banner">
				 <img :src="list.shopPic"/>
			 </div>
       <div class="chj_info">
            <div class="chj_info__avatar">
                <img :src="list.ownerHeadimage"/>
            </div> 
            <div class="chj_info__msg">
                <p>{{list.shopName}}</p>
								<span>档口位置：{{list.partsCityArea}}</span>
								<span>档口电话：{{list.ownerMobile}}</span>
            </div>
       </div>
			 <div class="chj_info-bottom"></div>
			 <div class="chj_store">
					<ul class="chj_store_nav">
						
						<li :class="{'current':currentIndex == 1 }">店铺介绍</li>
						<li :class="{'current':currentIndex == 2 }">配件展示</li>
					</ul>
					<!--店铺介绍-->
					<div class="chj_store_con">
						<template v-for="(item, index) in list.sumList">
							<p>{{item.tit}}</p>
							<span>{{item.content}}</span>
						</template>
					</div>
					<!-- <div class="chj_store_pro">
						<div class="">
							<img src="../../src/assets/avatar.png"/>
                            <span>车大灯</span>
						</div>
						<div >
							<img src="../../src/assets/avatar.png"/>
						</div>
						<div >
							<img src="../../src/assets/avatar.png"/>
						</div>
						<div>
							<img src="../../src/assets/avatar.png"/>
						</div>
						<div >
							<img src="../../src/assets/avatar.png"/>
						</div>
						<div >
							<img src="../../src/assets/avatar.png"/>
						</div>
						<div >
							<img src="../../src/assets/avatar.png"/>
						</div>
					</div> -->
			 </div>
			 <div class="chj_download-btn">
				 <span>下载陈田拆车件APP</span>
			 </div>
    </div>
</template>
<script>


export default {
    data() {
        return {
						list: null,
						currentIndex: 1
        }
    },
    created() {
			this._initShopDataFn()
    },
    methods: {
       _initShopDataFn() {
					this.$ajax({
						type: 'GET',
						api: 'shop/detail/',
						params: {
							id: this.$route.query.id,
							memberId: this.$route.query.memberId
						}
					}).then(res => {
						console.log(res)
						if(res.code === 200) {
							res.data.tit = res.data.summary.split('。')
							res.data.sumList = []
							res.data.tit.forEach(item => {
								let attr = item.split('：')
								attr[1] != undefined && res.data.sumList.push({tit: attr[0],content: attr[1]})
							})
							this.list = res.data
						}
					})
			 }
    },
    components: {
       
    }
}
</script>

